/**
 * 样衣详情
 */
import * as React from 'react'
import { Card, Form, Button, message } from 'antd'
import Authentication from '../../router/Authentication'
import { FormComponentProps } from 'antd/lib/form/Form'
import { PageHeaderLayout, DescriptionList, Description, Zmage } from '../../components'
import { post, CREATE_SAMPLE_BILL, ELIMINATE_SAMPLE } from '../../service/api'
import '../../assets/style/detail.less'
export interface Props{
  sample: any
  sampleImgs: any
  history: any
}

@Authentication
class ApplyDetail extends React.Component<Props & FormComponentProps, any> {

  handleOp = (type: number) => {
    const { sample: { id }, history } = this.props
    post(type==1?CREATE_SAMPLE_BILL:ELIMINATE_SAMPLE, { ids: id }).then((res: any) => {
      if (res.code == '1') {
        message.success('操作成功！')
        history.goBack()
      }else {
        message.error(res.errMsg)
      }
    })
  }
  render () {
    const { sampleImgs, sample, history } = this.props
    const getImgs = () => {
      let imgs = []
      if(sampleImgs) {
        if(sampleImgs.limg1) imgs.push(sampleImgs.limg1)
        if(sampleImgs.limg2) imgs.push(sampleImgs.limg2)
        if(sampleImgs.limg3) imgs.push(sampleImgs.limg3)
        if(sampleImgs.limg4) imgs.push(sampleImgs.limg4)
        if(sampleImgs.limg5) imgs.push(sampleImgs.limg5)
      }
      return imgs
    }
    return (
      <PageHeaderLayout 
        title = "">
        <Card bordered  title="基本资料">
          <DescriptionList size="large" title="样衣图片" style={{ marginBottom: 32 }}>
            <Description term="" style={{width: "100%"}}>
              {getImgs().map((img: string, index: number) => (
                <Zmage key={index} className="yy-img" src={img} />
              ))}
            </Description>
          </DescriptionList>
          <DescriptionList size="large" title="样衣信息" style={{ marginBottom: 32 }}>
            <Description term="样衣编码">{sample.sampleId}</Description>
            <Description term="波段号">{sample.bandname}</Description>
            <Description term="大类">{sample.dlText}</Description>
            <Description term="小小类">{sample.xlText}</Description>
            <Description term="供应商货号">{sample.pcode}</Description>
            <Description term="合作方式">{sample.jyfs}</Description>
            <Description term="供应商编码">{sample.supplierid}</Description>
            <Description term="供应商名称">{sample.vendername}</Description>
          </DescriptionList>
        </Card>
        <Card bordered style = {{marginTop: "20px"}}>
          <div style={{textAlign: 'center'}}>
            <Button type="primary" onClick={() => this.handleOp(1)}>生成初选单</Button>&nbsp;
            <Button onClick={() => this.handleOp(0)}>淘汰</Button>&nbsp;
            <Button onClick={() => {history.goBack()}}>返回</Button>
          </div>
        </Card>
      </PageHeaderLayout>
    )
  }
}
export default Form.create()(ApplyDetail)
